<style scoped >
    .declbody{height: 450px;overflow-y: auto;}
    .decl h4{
        padding: 0 15px;
        line-height: 33px;
        border: 1px solid #e5eaee;
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#fbfbfb), to(#f5f5f5));
    }
    .decl h4 .declmanatitle{
        color: #37b3b3;
        font-weight: normal;
        font-size: 14px;
    }
    .decl .declmanabody{padding: 15px 16px 0px;}
    .decl .ivu-row .ivu-col .ivu-form-item .ivu-form-item-content .ivu-input-wrapper{width: 90%;}
    .decl .ivu-row .ivu-col .ivu-form-item .ivu-form-item-content .ivu-select{width: 90%;}
    .decl .ivu-row .note.ivu-col .ivu-form-item .ivu-form-item-content .ivu-input-wrapper{width: 96%;}
    .decl .declmana{ padding: 15px 16px 20px;}
    .decl .declmana .ivu-form-item .ivu-form-item-content .ivu-input-wrapper{width: 90%;}
    .decl .footer{
        text-align: center;
        margin-bottom: 18px;
    }
    .decl .footer .save{
        width: 80px;
        background: #37b3b3;
        border: 1px solid #37b3b3;
        color: #ffffff;
    }
    .decl .footer .save:hover{background: #019ea3;}
    .decl .footer .clear{
        width: 80px;
        background: #c7cdcd;
        border:1px solid #c7cdcd;
        color: #ffffff;
    }
</style>
<template>
    <div class="console-product">
        <Row class="position">
            <i-col :xs="12" :sm="10" :md="8" :lg="6" >
                <div class="ivu-breadcrumb">
                    <span class="ivu-breadcrumb-item-link">当前位置：</span>
                    <span class="ivu-breadcrumb-item-link">跨境电商</span>
                    <span class="ivu-breadcrumb-item-separator">/</span>
                    <span class="ivu-breadcrumb-item-link">清单管理</span>
                </div>
            </i-col>
            <i-col class="fr">
                <span>
                    <Button  @click="exportdeclData()"><!--<Icon  class="cofont" type="document-text"></Icon>--><i class="iconfont cofont">&#xe647;</i> 批量生成报文</Button>
                </span>
            </i-col>
        </Row>
        <Modal class-name="popup" class="decl"  v-model="declModal" @on-cancel="cancelDeclMana('declManaValidate')" :mask-closable="false" width="860">
            <p slot="header" style="color: #eeebeb;"  v-drag>
                <span>编辑清单</span>
            </p>
            <div  class="declbody">
                <Form ref="declManaValidate" :rules="ruledeclManaCustom" :model="declManaValidate"  label-position="left" :label-width="125">
                    <Row class="declmanabody">
                        <i-col span="12">
                            <Form-item label="清单统一编号:" prop="seqNo">
                                <Input disabled v-model="declManaValidate.seqNo"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="清单海关编号:" prop="declformId">
                                <Input v-model="declManaValidate.declformId"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="运单统一编号:" prop="waybillSeqNo">
                                <Input disabled v-model="declManaValidate.waybillSeqNo"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="运单编号:" prop="waybillId">
                                <Input disabled v-model="declManaValidate.waybillId"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="贸易方式:" prop="tradeMode">
                                <Select v-model="declManaValidate.tradeMode">
                                    <Option v-for="option in tradeList" :label="option.name" :value="option.id" :key="option.id">
                                        <span>{{option.name}}</span>
                                    </Option>
                                </Select>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="抵运国:" prop="tradeCount">
                                <Input v-model="declManaValidate.tradeCount"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="币制:" prop="currCode">
                                <Select v-model="declManaValidate.currCode" clearable filterable>
                                    <Option v-for="option in currCodeList" :label="option.code" :value="option.code" :key="new Date()">
                                        <span>{{option.name}}</span>
                                        <span style="float:right;color:#ccc">{{option.code}}</span>
                                    </Option>
                                </Select>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="发货人名称:" prop="ownerName">
                                <Input v-model="declManaValidate.ownerName"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="收发货人证件类型:" prop="ownerCertType">
                                <Input v-model="declManaValidate.ownerCertType"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="收发货人证件号:" prop="ownerCertId">
                                <Input v-model="declManaValidate.ownerCertId"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="收发货人地址:" prop="ownerAddr">
                                <Input v-model="declManaValidate.ownerAddr"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="收发货人电话:" prop="ownerTel">
                                <Input v-model="declManaValidate.ownerTel"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="运输方式:" prop="trafMode">
                                <Input v-model="declManaValidate.trafMode"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="航次:" prop="voyagenNo">
                                <Input v-model="declManaValidate.voyagenNo"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="商户代码:" prop="ebCode">
                                <Input v-model="declManaValidate.ebCode"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="商品名称:" prop="ebName">
                                <Input v-model="declManaValidate.ebName"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="总件数:" prop="packNum">
                                <Input v-model="declManaValidate.packNum"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="12">
                            <Form-item label="总运费:" prop="totalFreight">
                                <Input v-model="declManaValidate.totalFreight"></Input>
                            </Form-item>
                        </i-col>
                        <i-col span="24" class="note">
                            <Form-item label="备注:" prop="note">
                                <Input type="textarea" v-model="declManaValidate.note"></Input>
                            </Form-item>
                        </i-col>
                    </Row>
                    <div class="footer">
                        <Button class="save" :loading="modal_loading" @click="editSaveDeclMana('declManaValidate')">保存</Button>
                    </div>
                </Form>
                <h4>
                    <span class="declmanatitle">商品信息</span>
                </h4>
                <div class="declmana">
                    <Modal v-model="delDeclManaModal" class="delectcont" class-name="delectDeclMana" width="250" @on-cancel="delDeclManaCancel" :mask-closable="false">
                        <p slot="header" style="color: #eeebeb" v-drag>
                            <span>提示框</span>
                        </p>
                        <p class="delDeclManabody">
                            <i class="iconfont" style="color: #f76165;font-size: 16px;">&#xe615</i>&nbsp;&nbsp;确认删除？
                        </p>
                        <div slot="footer">
                            <div class="footer">
                                <Button  class="save" :loading="delLoading" @click="delDeclManaOK">确认</Button>
                                <Button class="clear" @click="delDeclManaCancel">取消</Button>
                            </div>
                        </div>
                    </Modal>
                    <Table stripe border :columns="declManaColumns" ref="declManaData" :data="declManaData"></Table>
                </div>
            </div>
            <div slot="footer"></div>
        </Modal>
        <div class="console-product-contcent" id="contcentHeight" :style="{height:height +'px'}">
            <Form class="searchform" ref="declForm" :model="declForm" inline>
                <Form-item label="运单号:"  prop="waybillId" :label-width="50" style="width: 175px">
                    <Input v-model="declForm.waybillId" @on-enter="declFormSearch"></Input>
                </Form-item>
                <Form-item label="日期:" prop="createtime" :label-width="35" style="width: 240px">
                    <Date-picker type="daterange" v-model="declForm.createtime"  :options="creatDate0ptions" placeholder="选择日期" style="width: 200px"></Date-picker>
                </Form-item>
                <Form-item>
                    <Button class="search" @click="declFormSearch">搜索</Button>
                </Form-item>
            </Form>
            <Modal v-model="delModal" class-name="delect" width="250" @on-cancel="delCancel" :mask-closable="false">
                <p slot="header" style="color: #eeebeb"  v-drag>
                    <span>提示框</span>
                </p>
                <p class="delbody">
                    <i class="iconfont" style="color: #f76165;font-size: 16px;">&#xe615</i>&nbsp;&nbsp;确认删除？
                        </p>
                <div slot="footer">
                    <div class="footer">
                        <Button  class="save" :loading="delLoading" @click="delOK">确认</Button>
                        <Button class="clear" @click="delCancel">取消</Button>
                    </div>
                </div>
            </Modal>
            <Loading v-if="spinShow"></Loading>
            <Table v-if="tableShow"  @on-selection-change="selectChange" stripe border :columns="declColumns" ref="declData" :data="declData"></Table>
        </div>
        <Row style="background-color: #ffffff;margin-top: 1px;">
            <Col>
            <div v-if="tableShow" class="tablepage clearfix">
                <div class="fl">
                    <span>共</span>
                    <span class="num">{{total}}</span>
                    <span>条记录</span>
                    <span>{{currentPage}}/{{pageTotal}}页</span>
                </div>
                <div class="fr">
                    <Page :total="total" :page-size="pageSize" :current="currentPage" placement="top" show-elevator show-sizer @on-change="changePage" @on-page-size-change="changeSize"></Page>
                </div>
            </div>
            </Col>
        </Row>
    </div>
</template>
<script>
    // 导入要用到的子组件
    import Loading from '../../components/loading'
    export default {
        data () {
            const validatetotal = (rule, value, callback) => {
                var re = /^([1-9]\d{0,9}|0)([.]?|(\.\d{1,2})?)$/;
                if (re.test(value)) {
                    callback();
                } else {
                    callback(new Error('请输入数字(最多保留两位小数)'));
                }
            };
            return {
                modal_loading: false,
                total: 0,//总条数
                currentPage: 1,//当前页
                pageTotal: 1,//总页数
                pageSize: 10,//默认每页显示数量
                height: 1000,//表单高度
                delModal: false,//删除清单列表弹窗
                delLoading:false,//删除清单列表
                delId:'',//删除清单列表id
                delDeclManaModal: false,//删除编辑清单列表弹窗
                delDeclManaId:'',//删除清单列表id
                spinShow: true,//加载层，默认显示
                tableShow: false,//表格层，默认隐藏
                waybillids:"",
                currCodeList:[],
                declForm: {//运单管理条件查询
                    waybillId: '',
                    createtime: [new Date().getTime() - 3600 * 1000 * 24 * 7,new Date()]
                },
                creatDate0ptions: {
                    shortcuts: [
                        {
                            text: '最近一周',
                            value () {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                                return [start, end];
                            }
                        },
                        {
                            text: '最近一个月',
                            value () {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                                return [start, end];
                            }
                        },
                        {
                            text: '最近三个月',
                            value () {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                                return [start, end];
                            }
                        }
                    ]
                },
                tradeList:[
                    {id:'0',name:"一般贸易"},
                    {id:'1',name:"报税贸易"}
                ],
                declData:[],//数据
                declColumns:[
                    {
                        width:'4%',
                        type:'selection'
                    },
                    {
                        width:'4%',
                        title:'序号',
                        type:'index'
                    },
                    {
                        width:'8%',
                        title: '运单号',
                        key: 'waybillId',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.waybillId,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.waybillId)]);
                        }
                    },
                    {
                        width:'5%',
                        title: '进出口',
                        key: 'ieFlag',
                        render: (h, params) => {
                            const text = params.row.ieFlag == "E" ? "出口" : "进口";
                            return h('Tooltip', {
                                props: {
                                    content: text,
                                    placement:"bottom-start"
                                }
                            }, [h('span', text)]);
                        }
                    },
                    {
                        width:'6%',
                        title: '贸易方式',
                        key: 'tradeMode',
                        render: (h, params) => {
                            const text = params.row.tradeMode == "0" ? "一般贸易" : "保税贸易";
                            return h('Tooltip', {
                                props: {
                                    content: text,
                                    placement:"bottom-start"
                                }
                            }, [h('span', text)]);
                        }
                    },
                    {
                        width:'6%',
                        title: '申报口岸',
                        key: 'declPort',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.declPort,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.declPort)]);
                        }
                    },
                    {
                        width:'6%',
                        title: '进出口岸',
                        key: 'iePort',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.iePort,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.iePort)]);
                        }
                    },
                    {
                        width:'15%',
                        title: '发货人名称',
                        key: 'ownerName',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.ownerName,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.ownerName)]);
                        }
                    },
                    {
                        width:'10%',
                        title: '收货人地址',
                        key: 'ownerAddr',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.ownerAddr,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.ownerAddr)]);
                        }
                    },
                    {
                        width:'10%',
                        title: '收货人电话',
                        key: 'ownerTel',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.ownerTel,
                                    placement:"bottom-start"
                                }
                            }, [h('span', params.row.ownerTel)]);
                        }
                    },
                    {
                        width:'4%',
                        title: '状态',
                        key: 'sendStatus',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.returnDesc,
                                }
                            }, [params.row.returnCode != "0" ? h('i', {
                                class: 'iconfont icon-chahao',
                                style:{
                                    color: '#f76165'
                                }
                            }):h('i', {
                                class: 'iconfont icon-duihao',
                                style: {
                                    color: '#37b3b3'
                                }
                            })]);
                        }
                    },
                    {
                        width:'22%',
                        title: '操作',
                        key: 'id',
                        render: (h, params) => {
                            return h('div', [
                                h('Button',
                                    {
                                        class:"blue",
                                        on: {
                                            click: () => {
                                                this.editDecl(params.row.waybillId)
                                            }
                                        }
                                    },
                                    [
                                        h('i', {
                                            class : 'iconfont icon-bianji'
                                        }),
                                        h("span",'编辑')
                                    ]),
                                h('Button',
                                    {
                                        class:"red",
                                        on: {
                                            click: () => {
                                                this.remove(params.row.waybillId)
                                            }
                                        }
                                    },
                                    [
                                        h('i', {
                                            class : 'iconfont icon-qingkong'
                                        }),
                                        h("span",'删除')
                                    ]),
                                h('Button',
                                    {
                                        class:"blue",
                                        on: {
                                            click: () => {
                                                this.exportInvoice(params.row.waybillId)
                                            }
                                        }
                                    },
                                    [
                                        h('i', {
                                            class : 'iconfont icon-iconfontdocument1'
                                        }),
                                        h("span",'生成报文')
                                    ]),
                                h('Button',
                                    {
                                        class:"green",
                                        on: {
                                            click: () => {
                                                this.exportList(params.row.waybillId)
                                            }
                                        }
                                    },
                                    [
                                        h('i', {
                                            class : 'iconfont icon-daochuExcelbiaoge'
                                        }),
                                        h("span",'导出列表')
                                    ])
                            ]);
                        }
                    }
                ],
                declModal:false,
                declManaColumns:[
                    {
                        title:'序号',
                        width:'6%',
                        type:'index'
                    },
                    {
                        title: '订单编号',
                        width:'16%',
                        key: 'orderId',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.orderId
                                }
                            }, [h('span', params.row.orderId)]);
                        }
                    },
                    {
                        title: '商品名称',
                        width:'16%',
                        key: 'gName',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.gName
                                }
                            }, [h('span', params.row.gName)]);
                        }
                    },
                    {
                        title: '商品描述',
                        width:'16%',
                        key: 'gDesc',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.gDesc
                                }
                            }, [h('span', params.row.gDesc)]);
                        }
                    },
                    {
                        title: '规格型号',
                        width:'8%',
                        key: 'gModel',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.gModel
                                }
                            }, [h('span', params.row.gModel)]);
                        }
                    },
                    {
                        title: '面料号',
                        width:'12%',
                        key: 'fabricNo',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.fabricNo
                                }
                            }, [h('span', params.row.fabricNo)]);
                        }
                    },
                    {
                        title: '数量',
                        width:'8%',
                        key: 'gNum',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.gNum
                                }
                            }, [h('span', params.row.gNum)]);
                        }
                    },
                    {
                        title: '单价',
                        width:'8%',
                        key: 'price',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.price
                                }
                            }, [h('span', params.row.price)]);
                        }
                    },
                    {
                        title: '币制',
                        width:'8%',
                        key: 'currCode',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.currCode
                                }
                            }, [h('span', params.row.currCode)]);
                        }
                    },
                    {
                        title: '操作',
                        width:'8%',
                        key: 'id',
                        render: (h, params) => {
                            return h('div', [
                                h('span',
                                    {
                                        style:{
                                            cursor:'pointer',
                                            color:'#f76165'
                                        },
                                        on: {
                                            click: () => {
                                                this.removeDeclMana(params.row)
                                            }
                                        }
                                    },'删除'
                                )
                            ]);
                        }
                    }
                ],
                declManaData:[],//商品信息初始化
                declManaValidate:{
                    seqNo:'',//清单统一编号
                    declformId:'',//清单海关编号
                    waybillSeqNo:'',//运单统一编号
                    waybillId:'',//运单编号
                    tradeMode:'',//贸易方式
                    tradeCount:'',//抵运国
                    currCode:'',//币制
                    ownerName:'',//发货人名称
                    ownerCertType:'',//收发货人证件类型
                    ownerCertId:'',//收发货人证件号
                    ownerAddr:'',//收发货人地址
                    ownerTel:'',//收发货人电话
                    trafMode:'',//运输方式
                    voyageNo:'',//航次
                    ebCode:'',//商品代码
                    ebName:'',//商品名称
                    packNum:'',//总件数
                    totalFreight:'',//总运费
                    note:''//备注
                },
                ruledeclManaCustom:{//验证
                    seqNo: [
                        { type: 'string', max: 50, message: '清单统一编号不能大于50位', trigger: 'blur' }
                    ],
                    declformId: [
                        {required: true, message: '请输入清单海关编号', trigger: 'blur'},
                        { type: 'string', max: 50, message: '清单海关编号不能大于50位', trigger: 'blur' }
                    ],
                    waybillSeqNo: [
                        { type: 'string', max: 50, message: '运单统一编号不能大于50位', trigger: 'blur' }
                    ],
                    waybillId: [
                        { type: 'string', max: 50, message: '运单编号不能大于50位', trigger: 'blur' }
                    ],
                    tradeMode: [
                        {required: true, message: '请输入贸易方式', trigger: 'blur'},
                        { type: 'string', max: 50, message: '贸易方式不能大于50位', trigger: 'blur' }
                    ],
                    tradeCount: [
                        {required: true, message: '请输入抵运国', trigger: 'blur'},
                        { type: 'string', max: 20, message: '抵运国不能大于20位', trigger: 'blur' }
                    ],
                    currCode: [
                        {required: true, message: '请输入币制', trigger: 'blur'},
                        { type: 'string', max: 50, message: '币制不能大于50位', trigger: 'blur' }
                    ],
                    ownerName: [
                        {required: true, message: '请输入发货人名称', trigger: 'blur'},
                        { type: 'string', max: 50, message: '发货人名称不能大于50位', trigger: 'blur' }
                    ],
                    ownerCertType: [
                        { type: 'string', max: 50, message: '收发货人证件类型不能大于50位', trigger: 'blur' }
                    ],
                    ownerCertId: [
                        { type: 'string', max: 50, message: '收发货人证件号不能大于50位', trigger: 'blur' }
                    ],
                    ownerAddr: [
                        {required: true, message: '请输入收发货人地址', trigger: 'blur'},
                        { type: 'string', max: 1000, message: '收发货人地址不能大于1000位', trigger: 'blur' }
                    ],
                    ownerTel: [
                        {required: true, message: '请输入收发货人电话', trigger: 'blur'},
                        { type: 'string', max: 20, message: '收发货人电话不能大于20位', trigger: 'blur' }
                    ],
                    trafMode: [
                        {required: true, message: '请输入运输方式', trigger: 'blur'},
                        { type: 'string', max: 20, message: '运输方式不能大于20位', trigger: 'blur' }
                    ],
                    voyagenNo: [
                        {required: true, message: '请输入航次', trigger: 'blur'},
                        { type: 'string', max: 50, message: '航次不能大于50位', trigger: 'blur' }
                    ],
                    ebCode: [
                        {required: true, message: '请输入商品代码', trigger: 'blur'},
                        { type: 'string', max: 50, message: '商品代码不能大于50位', trigger: 'blur' }
                    ],
                    ebName: [
                        {required: true, message: '请输入商品名称', trigger: 'blur'},
                        { type: 'string', max: 50, message: '商品名称不能大于50位', trigger: 'blur' }
                    ],
                    packNum: [
                        { required: true, message: '请输入总件数', trigger: 'blur'},
                        { type: 'string', max: 11, message: '总件数不能大于11位', trigger: 'blur' }
                    ],
                    totalFreight: [
                        {required: true, message: '请输入总运费', trigger: 'blur'},
                        {type: 'string', validator: validatetotal, trigger: 'blur'},
                        { type: 'string', max: 50, message: '总运费不能大于50位', trigger: 'blur' }
                    ]
                },
                declManaIndex:''
            }
        },
        //所需子组件
        components: {
            Loading
        },
        created:function(){
            var width = window.innerWidth;
            if(width >1600){
                this.height=window.innerHeight-200;
            }else if(width > 1440 && width <=1600){
                this.height=window.innerHeight-180;
            }else if(width > 1366 && width <=1440){
                this.height=window.innerHeight-172;
            }else if(width > 1280 && width <=1366){
                this.height=window.innerHeight-166;
            }else if(width > 1024 && width <=1280){
                this.height=window.innerHeight-162;
            }else{
                this.height=window.innerHeight-151;
            }
            if(window.innerWidth > 1600){
                this.pageSize=20;
            }
            this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
            axios.get('/dict/4').then(res => {
                this.currCodeList=res.data;
            }).catch(err =>{
            });
        },
        mounted() {
            $(".declbody").scroll(function() {
                if(sessionStorage.getItem("declbodyScrollTop") == "YES"){
                    $('.declbody').animate({ scrollTop: 0 }, 1);
                    sessionStorage.setItem("declbodyScrollTop","NO");
                };
            });
        },
        methods: {
            //查询物流数据，条件，当前页，每页显示多少条
            declTableData (formData,currentPage,pageSize) {
                this.spinShow=true;
                this.tableShow = false;
                var waybillId = formData.waybillId;//运单号
                var fromDate = '';//开始时间
                var toDate = '';//结束时间
                if(formData.createtime.length != 0  && formData.createtime[0] != null && formData.createtime[1] != null && formData.createtime[0] != "" && formData.createtime[1] != ""){
                    var fromDateTime = (new Date(formData.createtime[0])).getTime();
                    fromDate = new Date(fromDateTime).format("yyyy-MM-dd");
                    var toDateTime = (new Date(formData.createtime[1])).getTime();
                    toDate = new Date(toDateTime).format("yyyy-MM-dd");
                }
                let data = {
                    params: {
                        pageIndex : currentPage,
                        pageSize : pageSize,
                        waybillId : waybillId,
                        fromDate : fromDate,
                        toDate : toDate
                    }
                };
                axios.get('/declheads',data).then(res => {
                    this.total=res.data.total;
                    this.pageTotal=Math.ceil(res.data.total / pageSize);
                    this.declData = res.data.data;
                    this.spinShow=false;
                    this.tableShow = true;
                }).catch(err =>{
                })
            },
            //条件查询
            declFormSearch () {
                this.currentPage = 1;
                this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
            },
            //改变页数
            changePage: function (page) {
                this.currentPage=page;
                this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
            },
            //改变每页显示多少条
            changeSize: function (pageSize) {
                this.currentPage=1;
                this.pageSize = pageSize;
                this.pageTotal=Math.ceil(this.total / this.pageSize);
                this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
            },
            //单选 全选
            selectChange(selection) {
                var waybillidList = "";
                for(var index in selection){
                    waybillidList += selection[index].waybillId + "-";
                }
                if(waybillidList.length > 0) {
                    waybillidList = waybillidList.substring(0, waybillidList.length-1);
                }
                this.waybillids = waybillidList;
            },
            //批量生成报文
            exportdeclData(){
                if(this.waybillids == ""){
                    this.$Message.error('请至少选择一个!');
                }else{
                    axios.get('/declheads/'+this.waybillids+"/xmls").then(res => {
                        this.$Message.success('批量生成报文成功');
                    }).catch(err =>{
                    })
                }
            },
            //生成报文
            exportInvoice (waybillid) {
                axios.get('/declheads/'+ waybillid+"/xml").then(res => {
                    this.$Message.success('生成报文成功');
                }).catch(err =>{
                })
            },
            //根据ID删除清单列表
            remove(column){
                this.delModal=true;
                this.delId = column;
            },
            delOK(){
                this.delLoading = true;
                axios.delete('/declheads/'+this.delId).then(res => {
                    this.$Message.success('删除成功');
                    this.delLoading = false;
                    this.delModal=false;
                    this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
                }).catch(err =>{
                    this.delLoading = false;
                })
            },
            delCancel() {
                this.delModal=false;
                this.delId = '';
            },
            //删除商品信息
            removeDeclMana (column) {
                this.delDeclManaModal=true;
                this.declManaIndex = column._index;
                this.delDeclManaId = column.id;
            },
            delDeclManaOK(){
                this.delLoading = true;
                axios.delete('/declheads/goods/'+this.delDeclManaId).then(res => {
                    this.$Message.success('删除成功');
                    this.delDeclManaModal=false;
                    this.delLoading = false;
                    this.declManaData.splice(this.declManaIndex,1);
                    this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
                }).catch(err =>{
                    this.delLoading = false;
                })
            },
            delDeclManaCancel() {
                this.delDeclManaModal=false;
                this.delDeclManaId = '';
            },
            //编辑信息
            editDecl (column) {
                var width = window.innerWidth;
                if(width >1600){
                    $("textarea.ivu-input").attr("style","height:32px");
                }else if(width > 1440 && width <=1600){
                    $("textarea.ivu-input").attr("style","height:28px");
                }else if(width > 1366 && width <=1440){
                    $("textarea.ivu-input").attr("style","height:26px");
                }else if(width > 1280 && width <=1366){
                    $("textarea.ivu-input").attr("style","height:26px");
                }else if(width > 1024 && width <=1280){
                    $("textarea.ivu-input").attr("style","height:26px");
                }else{
                    $("textarea.ivu-input").attr("style","height:26px");
                }
                this.declModal = true;
                $(".declbody").scroll();
                axios.get('/declheads/'+column).then(res => {
                    this.declManaValidate=res.data;
                    this.declManaValidate.totalFreight = this.declManaValidate.totalFreight.toString();
                    this.declManaValidate.packNum = this.declManaValidate.packNum.toString();
                }).catch(err =>{
                });
                axios.get('/declheads/'+column+'/goods').then(res => {
                    this.declManaData=res.data;
                }).catch(err =>{
                });
            },
            //保存编辑
            editSaveDeclMana (name) {
                this.modal_loading = true;
                var m = 0;
                var arr = this.declManaValidate.note.replace(/(.)(?=[^$])/g,"$1,").split(",");
                for(var i=0;i<arr.length;i++)
                {
                    var c = arr[i];
                    if(/[\u4e00-\u9fa5]/g.test(c))  //中文字符
                    {
                        m = m + 2;
                    }
                    else //英文字符
                    {
                        m = m + 1;
                    }
                }
                if (m > 200) {
                    this.$Message.error('备注不能大于200位');
                    this.modal_loading = false;
                } else {
                    this.$refs[name].validate((valid) => {
                        if(valid){
                            axios.put('/declheads', this.declManaValidate).then(res => {
                                this.modal_loading = false;
                                this.declModal = false;
                                this.$Message.success('编辑成功');
                                this.declData = this.declTableData(this.declForm,this.currentPage,this.pageSize);
                            }).catch(err =>{
                                this.modal_loading = false;
                                this.$Message.error({content: err,duration: 0,closable:true});
                            });
                        }else{
                            this.modal_loading = false;
                        }

                    });
                }
            },
            //导出列表
            exportList(column){
                this.$Message.loading({
                    content: '正在导出数据，请稍后......',
                    duration: 0
                });
                this.exportExl('/declheads/'+column+'/export',"清单.xls");
            },
            exportExl(url,name){
                axios.get(url).then(res => {
                    const BOM = '\uFEFF';
                    // Add BOM to text for open in excel correctly
                    if (window.Blob && window.URL && window.URL.createObjectURL) {
                        const csvData = new Blob([BOM + res.data], { type: 'text/xls' });
                        const link = document.createElement('a');
                        link.download = name;
                        link.href = URL.createObjectURL(csvData);
                        link.target = '_blank';
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                    } else {
                        const link = document.createElement('a');
                        link.download =name;
                        link.href = 'data:attachment/xls;charset=utf-8,' + BOM + encodeURIComponent(res.data);
                        link.target = '_blank';
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                    }
                    this.$Message.destroy();
                }).catch(err =>{
                    this.$Message.destroy();
                    this.$Message.error({content: err,duration: 0,closable:true});
                });
            },
            //清空搜索
            clearDecl(){
                this.declForm = {//运单管理条件查询
                    waybillId: '',
                    createtime: ''
                };
            },
            //清空编辑弹窗
            cancelDeclMana(name){
                this.declModal = false;
                this.declManaData = [];
                this.$refs[name].resetFields();
                sessionStorage.setItem("declbodyScrollTop","YES");
            }
        }
    }
</script>